﻿@{
    ViewData["Title"] = "UnitsCreate";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h1 style="text-align:center">单位设置</h1>
<body>

    <form class="layui-form " action="" lay-filter="demo-val-filter" style="margin-top: 30px;">

        <div class="layui-form-item layui-col-md8">
            <label class="layui-form-label" style="font-size: 12px;">企业全程：</label>
            <div class="layui-input-block">
                <input type="text" name="unitFull" lay-verify="required" autocomplete="off" style="width:600px" placeholder="请输入企业全程" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item layui-col-md8">
            <label class="layui-form-label" style="font-size: 12px;"> 公司照片：</label>
            <div class="layui-upload">
                <button type="button" class="layui-btn" id="uploadBtn">上传图片</button>
                <div class="layui-upload-list">
                    <img class="layui-upload-img" id="unitLOGO" style="max-width: 200px; max-height: 200px;margin-left: 100px;">
                </div>
            </div>
        </div>

        <div class="layui-form-item layui-col-md8">
            <label class="layui-form-label" style="font-size: 12px;">行业标签：</label>
            <div class="layui-input-block">
                <input type="text" name="tradeLable" lay-verify="required" autocomplete="off" style="width:600px" placeholder="请输入行业标签" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item layui-col-md8">
            <label class="layui-form-label" style="font-size: 12px;">详细地址：</label>
            <div class="layui-input-block">
                <div class="layui-form-item" id="area-picker3">
                    <div class="layui-input-inline" style="width: 200px;">
                        <select id="province3" class="province-selector" lay-filter="province-3">
                            <option value="">--选择省--</option>
                        </select>
                    </div>
                    <div class="layui-input-inline" style="width: 200px;">
                        <select id="city3" class="city-selector" lay-filter="city-3">
                            <option value="">--选择市--</option>
                        </select>
                    </div>
                    <div class="layui-input-inline" style="width: 180px;">
                        <select id="county3" class="county-selector" lay-filter="county-3">
                            <option value="">--选择区--</option>
                        </select>
                    </div>
                </div>
            </div>
        </div>
        
        <div style="padding-left:20px">
            <!-- 地图容器 -->
            <div id="mapContainer" style="width: 650px; height:400px"></div>
        </div>

        <div class="layui-form-item layui-col-md8" style="padding-top:20px">  
            <label class="layui-form-label" style="font-size: 12px;">企业电话：</label>
            <div class="layui-input-block">
                <input type="text" name="unitPhone" lay-verify="required" autocomplete="off" style="width:600px" placeholder="请输入企业电话" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item layui-col-md8">
            <label class="layui-form-label" style="font-size: 12px;">统一社会信用码：</label>
            <div class="layui-input-block">
                <input type="text" name="unitCredit" lay-verify="required" autocomplete="off" style="width:600px" placeholder="请输入统一社会信用码" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item layui-col-md8">
            <label class="layui-form-label" style="font-size: 12px;">部门停用</label>
            <div class="layui-input-block">
                <input type="radio" id="unitState" name="unitState" value="0" title="使用" checked>
                <input type="radio" id="unitState" name="unitState" value="1" title="禁用">
            </div>
        </div>

        <div class="layui-form-item layui-col-md8">
            <label class="layui-form-label" style="font-size: 12px;">负责人：</label>

            <div class="layui-input-block" styl9b882845210535fcafcae2d1c66b6e19e="width:600px">
                <select name="unitPrinc">
                    <option value="0">请输入负责人</option>
                    <option value="1">张三</option>
                    <option value="2">李四</option>
                    <option value="3">王五</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button type="submit" class="layui-btn" lay-submit lay-filter="demo1">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                <div id="mapContainer" style="width: 100%; height: 400px;"></div>
            </div>
        </div>

    </form>

    <link rel="stylesheet" href="https://www.layuicdn.com/layui/v2.6.8/css/layui.css">
    <script src="https://www.layuicdn.com/layui/v2.6.8/layui.js"></script>
    <script src="https://webapi.amap.com/maps?v=1.4.15&key=9b882845210535fcafcae2d1c66b6e19"></script>

    <script>
        //配置插件目录
        layui.config({
            base: '/mods/'
        });

        // 创建地图
        var map = new AMap.Map('mapContainer', {
            zoom: 10, // 设置初始缩放级别
            center: [116.397428, 39.90923] // 设置初始地图中心点经纬度
        });

        layui.use(['form', 'laydate', 'util', 'layarea', 'layer', 'upload'], function () {
            var obj = {};
            var form = layui.form;
            var layer = layui.layer;
            var laydate = layui.laydate;
            var upload = layui.upload;
            var util = layui.util;
            var layarea = layui.layarea;
            var $ = layui.$;

            //上传图片
            upload.render({
                elem: '#uploadBtn',
                url: 'http://10.31.60.18:8000/AuthorizationSetRout/api/FileNames/FileNameURL', // 后端接口路径
                done: function (res) {
                    console.log(res)
                    // 上传完毕回调
                    $('#unitLOGO').attr('src', 'http://10.31.60.18:8000/AuthorizationSetRout/img/' + res); // 将上传成功的图片显示在页面上
                },
                error: function (res) {
                    console.log(res)
                    //请求异常回调
                    $('#uploadTexthtml(上传失败');
                }
            });

            laydate.render({
                elem: '#date'
            });
            layarea.render({
                elem: '#area-picker3',
                change: function (res) {
                    //选择结果
                    console.log(res);
                    obj.unitAddress = null;
                    obj.unitAddress = res.province + res.city + res.county;
                    console.log($("#province3").val());
                }
            });
            // 提交事件
            form.on('submit(demo1)', function (data) {
                var formData = data.field;
                obj.unitFull = formData.unitFull;
                obj.tradeLable = formData.tradeLable;
                obj.unitLOGO = $('#unitLOGO').attr('src');
                obj.unitPhone = formData.unitPhone;
                obj.unitCredit = formData.unitCredit;
                if (formData.unitState == 0) {
                    obj.unitState = true;
                }
                else {
                    obj.unitState = false;
                }
                obj.unitPrinc = formData.unitPrinc;
                console.log(obj);
                $.post({
                    url: "http://10.31.60.18:8000/AuthorizationSetRout/api/Units/UnitsCreate",
                    data: JSON.stringify(obj),
                    contentType: "application/json",
                    success: res => {
                        if (res > 0) {
                            var icon = 0;
                            layer.alert('添加成功', {
                                icon: 1,
                                shadeClose: true,
                                title: "企业新增",
                            }, function () {
                                location.href = "/Units/UnitsShow";
                            });
                        } else {
                            alert("添加失败");
                        }
                    }
                })
                return false; // 阻止默认 form 跳转
            });
        });
        function RestEmployee() {
            $(".layui-form").reset();
            layui.form.render();
        }
    </script>

</body>